<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页页面</title>
    <style>
        body {
            padding: 20px;
            margin: auto;
        }
    </style>
</head>
<body>
<!--首行-->

    <div style="margin-bottom: 20px">
        <a href="http://www.itheima.com/special/brandzly/index.html?jingjiahmpz-pz-pc-biaoti">
            <img src="img/img/logo2.png" alt="图片加载错误" title="黑马程序员" align="left"/>
        </a>
        <img src="img/img/header.jpg" alt="图片加载错误" title="正品保障" style="margin-left: 300px" />
        <span style="margin-left: 700px" >
        <a href="">登录</a>
        <a href="">注册</a>
        <a href="">购物车</a>
        </span>
    </div>

<!--首页展示图-->
    <div style="background-color: black">
        <a href="" style="color: white"><u>首页</u></a>
        <a href="" style="color: white"><u>手机数码</u></a>
        <a href="" style="color: white"><u>电脑办公</u></a>
        <a href="" style="color: white"><u>电脑办公</u></a>
        <a href="" style="color: white"><u>电脑办公</u></a>
        <a href="" style="color: white"><u>电脑办公</u></a>
        <span style="margin-left: 1200px">
            <input type="text" />
            <input type="button" value="搜索">
        </span>

    </div>
    <img src="img/img/bartlesvillecf.jpg" alt="图片显示错误" width="100%">

<!--商品-->
    <table width="100%">
        <tr>
            <td colspan="8">
                <font size="2px">热门商品</font>
                <img src="img/img/title2.jpg" alt="图片显示错误" />
            </td>
        </tr>
        <tr>
            <td rowspan="2">
                <img src="img/products/hao/big01.jpg" alt="图片显示错误">
            </td>
            <td></td>
            <td colspan="3" align="center">
                <img src="img/products/hao/middle01.jpg" alt="图片显示错误">
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
        </tr>
        <tr>
            <td></td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
        </tr>
        <tr>
            <td colspan="8">
                <img src="img/products/hao/ad.jpg" alt="图片显示错误" width="100%" />
            </td>
        </tr>
        <tr>
            <td colspan="8">
                <font size="2px">热门商品</font>
                <img src="img/img/title2.jpg" alt="图片显示错误" />
            </td>
        </tr>
        <tr>
            <td rowspan="2">
                <img src="img/products/hao/big01.jpg" alt="图片显示错误">
            </td>
            <td></td>
            <td colspan="3" align="center">
                <img src="img/products/hao/middle01.jpg" alt="图片显示错误">
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
        </tr>
        <tr>
            <td></td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
            <td align="center">
                <img src="img/products/hao/small03.jpg" alt="图片显示错误">
                <br />
                <a href="">火锅</a>
                <br />
                <font color="red">￥299.00</font>
            </td>
        </tr>
        <tr>
            <td colspan="8">
                <img src="img/img/footer.jpg" alt="图片显示错误"  width="100%"/>
            </td>
        </tr>
    </table>

<!--尾行-->
    <div align="center">
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <a href="">关于我们</a>
        <br />
        <font>Copyright&nbsp©&nbsp2005-2006&nbsp传智商场&nbsp版权所有</font>
    </div>

</body>
</html>